﻿<!--
 Copyright (c) 2011 Nokia Corporation.
 -->

<phone:PhoneApplicationPage 
    x:Class="SudokuMaster.Highscores"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
    mc:Ignorable="d" d:DesignHeight="800" d:DesignWidth="480"
    shell:SystemTray.IsVisible="False">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid Name="LayoutRoot">

        <!-- Background for the grid. Same image is used as in main page. -->
        <Image Source="Background.png" Stretch="Fill" />

        <!-- Sudokumaster logo/title on the top of the page. -->
        <Image HorizontalAlignment="Center" Source="gfx/logo.png" VerticalAlignment="Top" />

        <!-- The highscores text below the logo. -->
        <TextBlock Text="Highscores"
                   Style="{StaticResource PhoneTextTitle1Style}"
                   HorizontalAlignment="Center" FontSize="40"
                   Foreground="White" Margin="0,100,0,0" />

        <!-- And the listbox containing the scores sbelow the text. -->
        <ListBox Name="HighscoreList" FontSize="28" Margin="0,160,0,0"
                 Foreground="White" HorizontalAlignment="Stretch">

            <!-- Define item template. Each item in the listbox is constructed
            from four textblocks; position, name, time and moves.-->
            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                </Style>
            </ListBox.ItemContainerStyle>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Name="ListBoxItemGrid" HorizontalAlignment="Stretch">

                        <!-- Columns for the textblocks -->
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="10*" />
                            <ColumnDefinition Width="55*" />
                            <ColumnDefinition Width="25*" />
                            <ColumnDefinition Width="10*" />
                        </Grid.ColumnDefinitions>

                        <!-- Note the data binding ('{Binding *}'). The list box
                        is populated by binding the list of scores with
                        "HighscoreList.ItemsSource = scores;" in the constructor
                        of HighscoresPage. -->
                        <TextBlock Grid.Column="0" Text="{Binding Index}" />
                        <TextBlock Grid.Column="1" Text="{Binding Name}" />
                        <TextBlock Grid.Column="2" Text="{Binding Time}" />
                        <TextBlock Grid.Column="3" Text="{Binding Moves}" />
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

</phone:PhoneApplicationPage>
